/**
 * Created by 86153 on 2018/7/7.
 */
//var p=document.getElementById("dian");
//var list= p.getElementsByTagName("li");
//var img=document.getElementById("img");
//var imgArr=["5ae88157Nffe22df7.jpg","5b3b5690N6bc04917.jpg","5b3c93e1N2337b5e1.jpg","5b3ca2acNc0f89eaa.jpg","5b3d7f8eN5bc4bfe7.jpg","5b3d9723Nffee1ee0.jpg","5b3db2beN4363eea0.jpg","5b39d803Nc5c411e6.jpg"];
//function  change(index){
//    for(var i = 0; i <= imgArr.length; i++) {
//        if(index == i) {
//            img.src = "img/" + imgArr[i];
//            list[i].style.backgroundColor = "#fff";
//        } else {
//            list[i].style.backgroundColor = "rgba(0,0,0,.4)";
//        }
//    }
//}


//====================================================================
var img=document.getElementById("img");
var imgLis =img .getElementsByTagName("li");
var circleLis = document.getElementById("circle").getElementsByTagName("li");
var btnL = document.getElementById("btnL");
var btnR = document.getElementById("btnR");
var idx = 0;

change();
var timer;
function change(){
    clearInterval(timer);
   timer= setInterval(btnR.onclick = function(){
        idx++;
        changePic();
    },2000);
}
img.onmousemove=function(){
    clearInterval(timer);
};
img.onmouseout=function(){
    change();
};
btnL.onclick = function(){
    idx--;
    changePic();
};
for(var i = 0 ; i < circleLis.length; i++){
    circleLis[i].idxxx = i;
    circleLis[i].onmouseover = function(){
        idx = this.idxxx;
        changePic();
    }
}

function changePic(){
    if(idx > imgLis.length-1) idx = 0;
    if(idx < 0) idx = imgLis.length-1;
    for(var i = 0; i < imgLis.length; i++){
        imgLis[i].className = "";
    }
    imgLis[idx].className = "current";
    for(var i = 0; i < circleLis.length; i++){
        circleLis[i].className = '';
    }
    circleLis[idx].className ="current";
}
//
var skimg=document.getElementById("skimg").getElementsByTagName("img");
var yuan=document.getElementById("yuan").getElementsByTagName("li");
